<template>
    <a-popover :title="fileName" >
            <div slot="content" style="text-align:center">
                <a @click="handleDown()">
                    <a-icon type="cloud-download"/>
                    下载
                    <AkFileDown :url="url" ref="AkFileDown"/>
                </a>
            </div>
            <img  :large="url"  :style="`height:${imgHeight}px; width:${imgHeight}px`" :src="orginUrl"
             :preview="url"/>

    </a-popover>

</template>
<script>
import AkFileDown from './AkFileDown';
import {fileManager} from "../../../api/url";
import {concatUrl} from "../../../utils/util";

export default {
    name:"AkImgPreview",
    describe:"图片预览",
    components:{AkFileDown},
    props:{
        url:{
            type:String,
            required:true
        },
        fileName:{
            type:String,
            required:false,
            default:''
        },
        imgHeight:{
            type:Number,
            required:false,
            default:50
        }
    },
    data(){
        return {
            orginUrl:'',
        }
    },
    mounted(){
      this.initOriginUrl(this.url);
    },
    methods:{

        handleDown(){
            this.$refs.AkFileDown.down();
        },
        initOriginUrl(value){
            if(!value){
                this.orginUrl = null;
                return;
            }
            try{
                let split = value.split(fileManager.fileBaseUrl);
                if(split.length > 1){
                    let baseUrl = split[0];
                    let img = split[1];
                    let imgUrls = img.split('/');
                    if(imgUrls.length>1){
                        let type = imgUrls[0];
                        let name = imgUrls[imgUrls.length-1];
                        let urlStr = '/';
                        if(imgUrls.length>2){
                            let urls = imgUrls.filter((e, index)=>{return index !=0 && index != (imgUrls.length-1)});
                            urlStr = urlStr + urls.join("/");

                        }

                        this.orginUrl = concatUrl(concatUrl(baseUrl, fileManager.filePrewUrl), img);
                    }else{
                        this.orginUrl = value;
                    }



                }else {
                    this.orginUrl = value;
                }
            }catch (e) {
                console.error('预览图片分割',e)
                this.orginUrl = value;
            }


        }
    },
    watch:{
        url(value){
            this.initOriginUrl(value);
        }
    }

}
</script>
